<template>
  <div>
    <base-info
      ref="refBase"
      :shop-code="detailData.shopCode"
      :patrol-id="detailData.patrolId"
    />
    <patrol-question
      ref="refProblem"
      no-count
      :schedule="detailData.schedule"
      :config-id-after="configIdAfter"
      :config-id-before="configIdBefore"
      :patrol-id="detailData.patrolId"
      :is-detail="!!detailData.isDetail"
    />
    <NodeList />
    <div v-if="!detailData.isDetail">
      <div class="qup-title-box"><span class="border" /><span>意见信息</span></div>
      <Opinion :id="detailData.patrolId" ref="refOpinion" :type="$route.query.type" />
      <div class="footer-btn">
        <!-- <el-button :loading="saveLoading" type="primary" size="mini" @click="handelSave(0)">保存 </el-button> -->
        <el-button :loading="saveLoading" type="warning" size="mini" @click="handelSave(1)">提交 </el-button>
        <el-button size="mini" @click.native="handleBack">返回</el-button>
      </div>
    </div>

  </div>
</template>
<script>
import Opinion from '../decorateInspection/components/Opinion.vue'
import NodeList from '../decorateInspection/components/NodeList.vue'
import { postConfigAttachmentTemplate } from '@/api/marketService/dailyPatrol'
import { submitAudit, saveAudit } from '@/api/marketService/problemRectify'

import PatrolQuestion from '../dailyPatrol/components/PatrolQuestion.vue'
import BaseInfo from './components/BaseInfo.vue'

export default {
  name: 'PatrolRectify',
  components: { BaseInfo, PatrolQuestion, NodeList, Opinion },
  data() {
    return {
      saveLoading: false,
      configIdAfter: '',
      configIdBefore: '',
      detailData: { id: '', patrolId: '', isDetail: 0, shopCode: '', schedule: '' }
    }
  },
  created() {
    const { id, patrolId, isDetail, shopCode, schedule } = this.$route.query
    this.detailData = { id, patrolId, isDetail, shopCode, schedule }
    postConfigAttachmentTemplate().then(res => {
      if (res.success && res.data.records) {
      // 根据belongModel获取每个配置id
        const tempArr = res.data.records.filter(el => el.enable === 1)
        tempArr.map(el => {
          // if (el.attachmentType === '卖场重点区域图片') this.keyShopCongifId = el.id
          // if (el.attachmentType === '参与人合照') this.picConfigId = el.id
          if (el.attachmentType === '整改前') this.configIdBefore = el.id
          if (el.attachmentType === '整改后') this.configIdAfter = el.id
        })
      }
    })
  },
  methods: {
    handleBack() {
      this.$store.dispatch('views/goBack')
    },
    async  handelSave() {
      const { type } = this.$route.query
      const formData = await this.$refs.refOpinion.getData()
      if (type === 2 || type === '2') { // 上传整改资料
        const problemData = this.$refs.refProblem.getValid(type)
        if (!problemData) {
          this.$message.warning('有未整改问题，请先整改后在提交')
          return
        }
        this.saveLoading = true
        submitAudit({ ...formData, id: this.detailData.id }).then(res => { // 上传资料提交
          if (res.success) {
            this.saveLoading = false
            this.$message.success('提交成功')
            this.handleBack()
          }
        }).catch(() => {
          this.saveLoading = false
        })
      } else {
      // 审核
        this.saveLoading = true
        saveAudit({ ...formData, id: this.detailData.id }).then(res => {
          if (res.success) {
            this.saveLoading = false
            this.$message.success('提交成功')
            this.handleBack()
          }
        }).catch(() => {
          this.saveLoading = false
        })
      }
    }
  }
}
</script>
<style lang="scss" scoped>
.footer-btn{
      position: fixed;
      left: 0;
      right: 2px;
      bottom: 0;
      padding: 10px;
      margin-top: 20px;
      border-top: 1px solid #eee;
      background-color: #fff;
      z-index: 9;
      box-shadow:0 0 4px #eee;
      text-align: center;
      .el-button+.el-button{
        margin-left: 20px;
      }
    }
</style>
